.root {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100vw;
    height: 100vh;
    background: #00021c;
    overflow: hidden;
}

.left {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.right {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-basis: 350px;
    height: 350px;
    z-index: 100;

    .box {
        padding: 16px 40px;
        height: 100%;
        width: 100%;
        border-radius: 0;
        // background: #f8f8f9;

        .header {
            font-size: 25px;
            text-align: center;
            padding: 30px;
            color: #fff;
            font-weight: bolder;
        }

        .submit-btn {
            width: 100%;
        }

        .error-tip {
            height: 30px;
            line-height: 30px;
            text-align: center;
            color: red;
        }

        .tip {
            color: #ccc;
            text-align: center;

            span {
                margin-right: 8px;
            }
        }

        .form-item {
            transition-delay: 5s;
            transition: 500ms;
            transform: translateX(100%);

            &:nth-child(2n) {
                transform: translateX(-100%);
            }

            &.active {
                transform: translateX(0);
            }
        }
    }

    :global {
        .inputLine {
            .ant-input {
                height: 42px;
            }

            .ant-btn {
                height: 42px;
                font-size: 14px;
            }

            .ant-form-explain {
                margin-top: 3px;
            }
        }
    }
}

